<#include "/default/utils/ui.ftl"/>

<@layout>
<div class="row streams">
    <#list channels as row>
        <div class="col-xs-12 col-md-3" style="margin-bottom:10px;">
            <a href="/channel/${row.id}" title="${row.name}">
                <img src="/static/default/images/${row.id}.jpg" class="img-responsive" alt="${row.name}">
            </a>
        </div>
    </#list>
    <div class="col-xs-1 col-md-1" style="text-align: center;"></div>
    <#--<div class="col-xs-10 col-md-10" style="text-align: center;">-->
        <#--<script type="text/javascript">var jd_union_unid="2714",jd_ad_ids="505:6",jd_union_pid="CPqchP/MLBCaFRoAIKq1rpkFKgA=";var jd_width=960;var jd_height=90;var jd_union_euid="";var p="AhAPURlcEgYVD2VEH0hfIlgRRgYlXVZaCCsfSlpMWGVEH0hfIlU%2BcwxIHHVVNU8HSVdUfC99J0BXSXdZF2sVABsOURxYFAQWN1YdWxAyIlgRRgYlSXwGZUQfSF8iB1EZWBAKFg9dGlkdBiIGZStr";</script><script type="text/javascript" charset="utf-8" src="//u-x.jd.com/static/js/auto.js"></script>-->
    <#--</div>-->
    <div class="col-xs-1 col-md-1" style="text-align: center;"></div>
    <div class="col-xs-12 col-md-12 side-left" style="padding-top:10px;">
        <div class="panel panel-default">
            <div class="panel-heading">
                <ul class="list-inline topic-filter">
                    <li data-toggle="tooltip" title="发布时间排序">
                        <a href="?order=newest" <#if order == 'newest'> class="active" </#if>>最近</a>
                    </li>
                    <li data-toggle="tooltip" title="点赞数排序">
                        <a href="?order=favors" <#if order == 'favors'> class="active" </#if>>投票</a>
                    </li>
                    <li data-toggle="tooltip" title="评论次数排序">
                        <a href="?order=hottest" <#if order == 'hottest'> class="active" </#if>>热门</a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>

            <@contents pn=pn order=order>
                <div class="panel-body remove-padding-horizontal">
                    <ul class="list-group row topic-list">
                        <#list results.content as row>
                            <li class="list-group-item col-xs-12 col-md-6">
                                <a class="reply_count_area hidden-xs pull-right" href="#">
                                    <div class="count_set">
                                        <span class="count_of_votes" data-toggle="tooltip" title="阅读数">${row.views}</span>
                                        <#--<span class="count_seperator">/</span>-->
                                        <#--<span class="count_of_replies" data-toggle="tooltip" title="回复数">${row.comments}</span>-->
                                        <#--<span class="count_seperator">/</span>-->
                                        <#--<span class="count_of_visits" data-toggle="tooltip" title="点赞数">${row.favors}</span>-->
                                        <span class="count_seperator">|</span>
                                        <abbr class="timeago">${(row.lastUpadteTime?string('yyyy-MM-dd'))!}</abbr>
                                        <span class="count_seperator">|</span>
                                        <abbr class="timeago">${timeAgo(row.created)}</abbr>
                                    </div>
                                </a>
                                <div class="avatar pull-left">
                                    <a href="${base}/users/${row.author.id}">
                                        <img class="media-object img-thumbnail avatar avatar-middle"
                                             src="${base + row.author.avatar}">
                                    </a>
                                </div>
                                <div class="infos">
                                    <div class="media-heading">
                                        <@classify row/><a href="${base}/view/${row.id}">${row.title}</a>
                                    </div>
                                </div>
                            </li>
                        </#list>

                        <#if  results.content?size == 0>
                            <li class="list-group-item ">
                                <div class="infos">
                                    <div class="media-heading">该目录下还没有内容!</div>
                                </div>
                            </li>
                        </#if>
                    </ul>
                </div>
                <div class="panel-footer text-right remove-padding-horizontal pager-footer">
                    <!-- Pager -->
                    <@pager request.requestURI!"", results, 5/>
                </div>
            </@contents>

        </div>
    </div>
    <#--<div class="col-xs-12 col-md-3 side-right">-->
    <#--<div class="col-xs-12 col-md-3">-->
        <#--<#include "/default/inc/right.ftl" />-->
    <#--</div>-->
</div>
</@layout>